<template>
  <div class="title-box">
    <div class="title-gallary"></div>
    <div class="title-des">
      <h3>直播电商销售员</h3>
      <p>
        2020年，画满了2本手绘本，用完了3管白颜料，数不清设计了多少稿。来到新年之交，将一年的作品整理打包，才发现，每一G文件都是这一年熬过的夜，加过的班；每一份飞机稿，都是这一年打过的小怪，升过的级。发布你的2020年度作品合集
      </p>
      <div class="tags">
        <a-tag>混合</a-tag>
        <a-tag>永久有效</a-tag>
      </div>
      <div class="time">40学时</div>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.title-box {
  width: 100%;
  height: 237px;
  box-sizing: border-box;
  padding: 20px 25px 26px 20px;
  background: #f5f5f5;
  border-radius: 6px;
  display: flex;
  margin-bottom: 38px;
  .title-gallary {
    width: 340px;
    height: 191px;
    background-color: red;
    margin-right: 25px;
  }
  .title-des {
    position: relative;
    h3 {
      margin: 0;
      height: 27px;
      font-size: 20px;
      font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
      font-weight: bold;
      color: #333333;
      line-height: 27px;
      margin-bottom: 10px;
    }
    p {
      margin: 0;
      max-height: 57px;
      font-size: 14px;
      font-family: MicrosoftYaHei;
      color: #999999;
      line-height: 19px;
      margin-bottom: 21px;
      width: 590px;
    }
    .tags {
      :deep(.ant-tag) {
        line-height: 22px;
        font-size: 14px;
        margin-right: 20px;
      }
    }
    .time {
      position: absolute;
      bottom: 0;
      height: 19px;
      font-size: 14px;
      font-family: MicrosoftYaHei;
      color: #1890ff;
      line-height: 19px;
    }
  }
}
</style>
